SpringMVC框架（4） —— 响应数据类型

项目结构

• java

  • controller
    • ResponseController.java（Java文件）
  • domain
    • User.java（JavaBean文件）

• resources

  • springmvc.xml（springmvc配置文件）

• webapp

  • css
  • images
  • js
    • jquery.min.js（js文档）
  • WEB-INF
    • pages
      • success.jsp（web页面）
    • web.xml（web配置文件）
  • index.jsp（web页面）
  • jquery.jsp（web页面）
  • response.jsp（web页面）

• pom.xml（maven项目配置文件）

maven项目配置文件

• 配置maven项目需要的依赖
  • spring-context
  • spring-web
  • spring-webmvc
  • servlet-api
  • jsp-api
  • jackson-databind
  • jackson-core
  • jackson-annotations

web配置文件

• 前端控制器（DispatcherServlet）
  • 配置一个前端控制器（<servlet>）
    • 创建前端控制器时，加载Spring配置文件（<init-param>）
    • 启动服务器时，创建前端控制器（<\load-on-startup>）
  • 配置前端控制器的作用范围（<servlet-mapping>）
• 过滤器（CharacterEncodingFilter）
  • 配置一个过滤器（<filter>）
    • 配置编码（<init-param>）：解决中文乱码
  • 配置前端控制器的作用范围（<filter-mapping>）

springmvc配置文件

• 导入名称空间（<beans xmlns=””>）
• 开启注解扫描（<context:component-scan base-package=””>）
• 配置视图解析器（InternalResourceViewResolver）
  • 配置前缀（prefix -> “/WEB-INF/pages”）
  • 配置后缀（suffix -> “.jsp”）
• 配置前端控制器（<mvc:resource >）
• 开启SpringMVC注解支持（<mvc:annotation-driven>）

Java文件

• 表现层
  • 类
    • 添加进IoC核心容器（@Controller）
    • 设置请求映射（@RequestMapping()）
      • 一级目录（path=””）
      • 设置允许访问的请求方法（method=””）
      • 设置必需的参数和参数值（params=””）
        • 设置必需的请求头（headers=””）
  • 方法
    • 设置请求映射（@RequestMapping()）
      • 二级目录（path=””）
    • 返回值（return “success”;）
    • 参数列表（数据类型 请求参数名，数据类型 请求参数名）
      • HttpServletRequest：获取Request、Session，用于请求转发、获取Request URI
      • HttpServletResponse：获取Response，用于重定向、设置中文乱码

JSP文件

• 超链接（href=”一级目录/二级目录?请求参数=值&请求参数=值”）
• 表单（<form action=”一级目录/二级目录” method=”post”>）

执行代码

• 需求：在response.jsp页面，点击的超链接，跳转到success.jsp页面，并且在页面输出响应消息。

pom.xml

<?xml version="1.0" encoding="UTF-8"?>

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>

  <groupId>cn.water</groupId>
  <artifactId>section02_Response</artifactId>
  <version>1.0-SNAPSHOT</version>
  <packaging>war</packaging>

  <name>section02_Response Maven Webapp</name>
  <!-- FIXME change it to the project's website -->
  <url>http://www.example.com</url>

  <!-- 版本锁定 -->
  <properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.source>1.8</maven.compiler.source>
    <maven.compiler.target>1.8</maven.compiler.target>
    <spring.version>5.0.2.RELEASE</spring.version>
  </properties>

  <!-- 依赖注入 -->
  <dependencies>
    <!-- spring -->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!-- spring-web -->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-web</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!-- spring-webmvc -->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-webmvc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!-- servlet -->
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>servlet-api</artifactId>
      <version>2.5</version>
      <scope>provided</scope>
    </dependency>
    <!-- jsp -->
    <dependency>
      <groupId>javax.servlet.jsp</groupId>
      <artifactId>jsp-api</artifactId>
      <version>2.0</version>
      <scope>provided</scope>
    </dependency>
    <!-- Jackson：用于Ajax异步请求，将Json类型数据转化为JavaBean类型 -->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.9.0</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.9.0</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-annotations</artifactId>
      <version>2.9.0</version>
    </dependency>
  </dependencies>


  <build>
    <finalName>section02_Response</finalName>
    <pluginManagement><!-- lock down plugins versions to avoid using Maven defaults (may be moved to parent pom) -->
      <plugins>
        <plugin>
          <artifactId>maven-clean-plugin</artifactId>
          <version>3.1.0</version>
        </plugin>
        <!-- see http://maven.apache.org/ref/current/maven-core/default-bindings.html#Plugin_bindings_for_war_packaging -->
        <plugin>
          <artifactId>maven-resources-plugin</artifactId>
          <version>3.0.2</version>
        </plugin>
        <plugin>
          <artifactId>maven-compiler-plugin</artifactId>
          <version>3.8.0</version>
        </plugin>
        <plugin>
          <artifactId>maven-surefire-plugin</artifactId>
          <version>2.22.1</version>
        </plugin>
        <plugin>
          <artifactId>maven-war-plugin</artifactId>
          <version>3.2.2</version>
        </plugin>
        <plugin>
          <artifactId>maven-install-plugin</artifactId>
          <version>2.5.2</version>
        </plugin>
        <plugin>
          <artifactId>maven-deploy-plugin</artifactId>
          <version>2.8.2</version>
        </plugin>
      </plugins>
    </pluginManagement>
  </build>
</project>

web.xml

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>


  <!--   【filter】   -->
  <filter>
    <!--   创建过滤器   -->
    <filter-name>characterEncodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <!--   配置编码   -->
    <init-param>
      <param-name>encoding</param-name>
      <param-value>UTF-8</param-value>
    </init-param>
  </filter>
  <!--   映射   -->
  <filter-mapping>
    <filter-name>characterEncodingFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>


  <!--   【servlet】   -->
  <servlet>
    <!--   创建前端控制器   -->
    <servlet-name>dispatcherServlet</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <!--   创建前端控制器时，加载spring配置文件   -->
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:springmvc.xml</param-value>
    </init-param>
    <!--   启动服务器时，创建前端控制器   -->
    <load-on-startup>1</load-on-startup>
  </servlet>
  <!--   映射   -->
  <servlet-mapping>
    <servlet-name>dispatcherServlet</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>
</web-app>

springmvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="
        http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc
        http://www.springframework.org/schema/mvc/spring-mvc.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd">


    <!-- 开启注解扫描 -->
    <context:component-scan base-package="cn.water"/>


    <!-- 视图解析器 -->
    <bean id="internalResourceViewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver" >
        <!-- 配置前缀 -->
        <property name="prefix" value="/WEB-INF/pages/"></property>
        <!-- 配置后缀 -->
        <property name="suffix" value=".jsp"></property>
    </bean>

    <!-- 前端控制器（设置免拦截的静态资源） -->
    <mvc:resources mapping="/js/**" location="/js/"></mvc:resources>  <!-- js -->
    <mvc:resources mapping="/images/**" location="/images/"></mvc:resources> <!-- 图片 -->
    <mvc:resources mapping="/css/**" location="/css/"></mvc:resources> <!-- 样式 -->

    <!-- 开启springMVC框架注解支持 -->
    <mvc:annotation-driven/>


</beans>

ResponseController.java

package cn.water.controller;

import cn.water.domain.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

/**
 * @author Water
 * @date 2019/9/11 - 20:16
 */
@Controller
@RequestMapping("/response")
public class ResponseController {

    /* 【返回值：String】 */
    @RequestMapping("/testString")
    public String testString(Model model){
//        获取用户对象
        User user = new User();
        user.setUsername("cat");
        user.setPassword("111");
        user.setAge(1);
//        将用户对象添加至Request域中
        model.addAttribute("user",user);
        return "success";
    }

    /* 【返回值：void】 */
    @RequestMapping("/testVoid111")
    public void testVoid111(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//        请求转发（不执行视图解析器）
        request.getRequestDispatcher("/WEB-INF/pages/success.jsp").forward(request,response);
        return;
    }
    /* 【返回值：void】 */
    @RequestMapping("/testVoid222")
    public void testVoid222(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//        重定向（不执行视图解析器，不能访问WEB-INF目录下页面）
        response.sendRedirect(request.getContextPath()+"/index.jsp");
        return;
    }
    /* 【返回值：void】 */
    @RequestMapping("/testVoid333")
    public void testVoid333(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//        设置中文乱码
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charaset=UTF-8");
//        直接响应
        response.getWriter().print("你好呀！");
        return;
    }


    /* 【返回值：ModelAndView】 */
    @RequestMapping("/testModelAndView")
    public ModelAndView testModelAndView(HttpServletRequest request, HttpServletResponse response){
//        获取对象
        ModelAndView modelAndView = new ModelAndView();
//        获取用户对象
        User user = new User();
        user.setUsername("dog");
        user.setPassword("222");
        user.setAge(2);
//        将用户对象添加至Request域中
        modelAndView.addObject("user",user);
//        设置跳转页面（执行视图解析器）
        modelAndView.setViewName("success");
        return modelAndView;
    }


    /* 【关键字】 */
    @RequestMapping("/testForward")
    public String testForward(){
        System.out.println("forward");
        return "forward:/WEB-INF/pages/success.jsp";
    }

    /* 【关键字】 */
    @RequestMapping("/testRedirect")
    public String testRedirect(HttpServletRequest request){
        System.out.println("redirect");
        String contextPath = request.getContextPath();
        /* 原本我们是要加上项目路径，但是SpringMVC框架帮我们自动添加了，所以我们只需要填写文件名 */
//        return "redirect:"+contextPath+"/index.jsp";
        return "redirect:/index.jsp";
    }



    /* 【Ajax异步请求】 */
    @RequestMapping("/testAjax")
    public @ResponseBody User testAjax( @RequestBody User user){
        /* 获取网页发送的数据 */
        System.out.println("用户对象："+user);
        /* 设置数据 */
        user.setUsername("dog");
        user.setPassword("222");
        user.setAge(2);
        /* 将数据返回给网页 */
        return user;
    }



}

User.jsp

package cn.water.domain;

/**
 * @author Water
 * @date 2019/9/11 - 20:19
 */
public class User {
    private String username;
    private String password;
    private Integer age;

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }

    @Override
    public String toString() {
        return "User{" +
                "username='" + username + '\'' +
                ", password='" + password + '\'' +
                ", age=" + age +
                '}';
    }
}

index.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <h2><a href="response.jsp">响应消息页面</a></h2>
    <h2><a href="jquery.jsp">静态资源页面</a></h2>
</body>
</html>

response.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>Title</title>
    <%-- 引入js资源 --%>
    <script src="js/jquery.min.js"></script>
    <script>
        $(function () {
            /* 绑定单击事件 */
            $("#btn1").click(function () {
                <%-- 【发送Ajax请求】 --%>
                $.ajax({
                    url:"response/testAjax", /* 发送请求的地址 */
                    contentType:"application/json;charset=UTF-8", /* 发送信息至服务器时内容编码类型 */
                    data:'{"username":"cat","password":"111","age":"1"}', /* 发送到服务器的数据 */
                    dataType:"json", /* 预期服务器返回的数据类型 */
                    type:"post", /* 请求方式 */
                    success:function (data) {
                        document.write("<h3>"+data+"</h3>");
                        document.write("<h3>"+data.username+"</h3>");
                        document.write("<h3>"+data.password+"</h3>");
                        document.write("<h3>"+data.age+"</h3>");
                    } /* 请求成功后的回调函数 */
                })
            })
            /* 绑定单击事件 */
            $("#btn2").click(function () {
                <%-- 【弹出提示信息】 --%>
                alert("hello,Ajax.");

            })
        })
    </script>


</head>
<body>
    <button id="btn2">弹出提示信息</button>
    <button id="btn1">发送Ajax请求</button>
</body>
</html>

jquery.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <h3><a href="response/testString">String</a></h3>
    <h3><a href="response/testVoid111">void：请求转发</a></h3>
    <h3><a href="response/testVoid222">void：重定向</a></h3>
    <h3><a href="response/testVoid333">void：直接响应</a></h3>
    <h3><a href="response/testModelAndView">ModelAndView</a></h3>
    <h3><a href="response/testForward">Forward</a></h3>
    <h3><a href="response/testRedirect">Redirect</a></h3>
</body>
</html>

success.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <h1>成功访问！！！</h1>
    <br>
    <h3>获取Request域中的用户对象：${requestScope.user} </h3>
    <h3>获取用户名：${user.username} </h3> <%-- requestScope可以省略 --%>
    <h3>获取密码：${user.password} </h3>
    <h3>获取年龄：${user.age} </h3>

</body>
</html>

方法返回值：String

• 发起请求

  <a href="response/testString">String</a>

• 接收请求，发出响应

      @RequestMapping("/testString")
      public String testString(Model model){
  //        获取用户对象
          User user = new User();
          user.setUsername("cat");
          user.setPassword("111");
          user.setAge(1);
  //        将用户对象添加至Request域中
          model.addAttribute("user",user);
          return "success";
      }

• 响应页面

  <h1>成功访问！！！</h1>
  <br>
  <h3>获取Request域中的用户对象：${requestScope.user} </h3>
  <%-- requestScope可以省略 --%>
  <h3>获取用户名：${user.username} </h3> 
  <h3>获取密码：${user.password} </h3>
  <h3>获取年龄：${user.age} </h3>

• 响应结果

  成功访问！！！
  
  获取Request域中的用户对象：User{username='cat', password='111', age=1}
  获取用户名：cat
  获取密码：111
  获取年龄：1

方法返回值：void

请求转发

• 发起请求

  <a href="response/testVoid111">void：请求转发</a>

• 接收请求，发起响应

      @RequestMapping("/testVoid111")
      public void testVoid111(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  //        请求转发（不执行视图解析器）
          request.getRequestDispatcher("/WEB-INF/pages/success.jsp").forward(request,response);
          return;
      }

• 响应结果

  成功访问！！！
  
  获取Request域中的用户对象：
  获取用户名：
  获取密码：
  获取年龄：

重定向

• 发起请求

  <a href="response/testVoid222">void：重定向</a>

• 接收请求，发出响应

      @RequestMapping("/testVoid222")
      public void testVoid222(HttpServletRequest request, HttpServletResponse response) throws IOException {
  //        重定向（不执行视图解析器，不能访问WEB-INF目录下页面）
          response.sendRedirect(request.getContextPath()+"/index.jsp");
          return;
      }

• 响应结果

  响应消息页面
  静态资源页面

直接响应

• 发起请求

  <a href="response/testVoid333">void：直接响应</a>

• 接收请求

      @RequestMapping("/testVoid333")
      public void testVoid333( HttpServletResponse response) throws IOException {
  //        设置中文乱码
          response.setCharacterEncoding("UTF-8");
          response.setContentType("text/html;charaset=UTF-8");
  //        直接响应
          response.getWriter().print("你好呀！");
          return;
      }

• 响应结果

  你好呀！

ModelAndView

• 发起请求

  <a href="response/testModelAndView">ModelAndView</a>

• 接收请求，发出响应

      @RequestMapping("/testModelAndView")
      public ModelAndView testModelAndView(HttpServletRequest request, HttpServletResponse response){
  //        获取对象
          ModelAndView modelAndView = new ModelAndView();
  //        获取用户对象
          User user = new User();
          user.setUsername("dog");
          user.setPassword("222");
          user.setAge(2);
  //        将用户对象添加至Request域中
          modelAndView.addObject("user",user);
  //        设置跳转页面（执行视图解析器）
          modelAndView.setViewName("success");
          return modelAndView;
      }

• 响应页面

  <h1>成功访问！！！</h1>
  <br>
  <h3>获取Request域中的用户对象：${requestScope.user} </h3>
  <%-- requestScope可以省略 --%>
  <h3>获取用户名：${user.username} </h3> 
  <h3>获取密码：${user.password} </h3>
  <h3>获取年龄：${user.age} </h3>

• 响应结果

  成功访问！！！
  
  获取Request域中的用户对象：User{username='dog', password='222', age=2}
  获取用户名：dog
  获取密码：222
  获取年龄：2

Spring框架关键字

Forward

• 发起请求

  <a href="response/testForward">Forward</a>

• 接收请求，发出响应

  @RequestMapping("/testForward")
  public String testForward(){
      System.out.println("forward");
      return "forward:/WEB-INF/pages/success.jsp";
  }

• 响应页面

  <h1>成功访问！！！</h1>
  <br>
  <h3>获取Request域中的用户对象：${requestScope.user} </h3>
  <h3>获取用户名：${user.username} </h3> <%-- requestScope可以省略 --%>
  <h3>获取密码：${user.password} </h3>
  <h3>获取年龄：${user.age} </h3>

• 响应结果

  成功访问！！！
  
  获取Request域中的用户对象：
  获取用户名：
  获取密码：
  获取年龄：

Redirect

• 发起请求

  <a href="response/testRedirect">Redirect</a>

• 接收请求，发出响应

  @RequestMapping("/testRedirect")
  public String testRedirect(HttpServletRequest request){
      System.out.println("redirect");
      String contextPath = request.getContextPath();
      /* 原本我们是要加上项目路径，但是SpringMVC框架帮我们自动添加了，所以我们只需要填写文件名 */
      // return "redirect:"+contextPath+"/index.jsp";
      return "redirect:/index.jsp";
  }

• 响应结果

  响应消息页面
  静态资源页面

Ajax 异步请求

• 发起请求

  <script>
      $(function () {
          /* 绑定单击事件 */
          $("#btn1").click(function () {
              <%-- 【发送Ajax请求】 --%>
              $.ajax({
                  /* 发送请求的地址 */
                  url:"response/testAjax", 
                  /* 发送信息至服务器时内容编码类型 */
                  contentType:"application/json;charset=UTF-8", 
                  /* 发送到服务器的数据 */
                  data:'{"username":"cat","password":"111","age":"1"}', 
                  /* 预期服务器返回的数据类型 */
                  dataType:"json", 
                  /* 请求方式 */
                  type:"post", 
                  /* 请求成功后的回调函数 */
                  success:function (data) {
                      document.write("<h3>"+data+"</h3>");
                      document.write("<h3>"+data.username+"</h3>");
                      document.write("<h3>"+data.password+"</h3>");
                      document.write("<h3>"+data.age+"</h3>");
                  } 
              })
          })
      })
  </script>
  <body>
      <button id="btn1">发送Ajax请求</button>
  </body>

• 接收请求，发出响应

  @RequestMapping("/testAjax")
  public @ResponseBody User testAjax( @RequestBody User user){
      /* 获取网页发送的数据 */
      System.out.println("用户对象："+user);
      /* 设置数据 */
      user.setUsername("dog");
      user.setPassword("222");
      user.setAge(2);
      /* 将数据返回给网页 */
      return user;
  }

• 响应结果

  [object Object]
  dog
  222
  2